<!--采购计划-->
<template>
  <div class="materalsComsumption">
    <div class="titlename"><b>材料库存情况（万元）</b> </div>
    <el-date-picker
      v-model="timedata.mouth"
      type="date"
      style="margin-left: 1%;margin-bottom: 20px"
      value-format="yyyy-MM-dd"
      size="small"
      @change="getList"
      placeholder="选择日期">
    </el-date-picker>
    <el-table
      v-loading="loading"
      :data="tableData"
      style="width: 98%;margin-left: 1%">
      <el-table-column
        prop="stock"
        align="center"
        label="实时库存">
      </el-table-column>
      <el-table-column
        prop="lastStock"
        align="center"
        label="上月末库存">
      </el-table-column>
      <el-table-column
        prop="contrast"
        align="center"
        label="库存超降">
        <template slot-scope="scope">
          <span style="color: red" v-show="scope.row.stock/1>scope.row.lastStock/1">{{scope.row.contrast}}</span>
          <span style="color: seagreen" v-show="scope.row.stock/1<scope.row.lastStock/1">{{scope.row.contrast}}</span>
          <span v-show="scope.row.stock/1==scope.row.lastStock/1">{{scope.row.contrast}}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="difference"
        align="center"
        label="利库">
      </el-table-column>
    </el-table>
  </div>
</template>

<script>

  import request from '@/utils/request'
  export default {
    name: "Role",
    data() {
      return {
        loading:false,
        timedata: {
          mouth:'',
        },
        tableData: []
      };
    },
    created() {
      var datedy = new Date(); //获取一个时间对象
      var niandy = datedy.getFullYear();  // 获取完整的年份(4位,1970)
      var yuedy = datedy.getMonth()+1;  // 获取月份(0-11,0代表1月,用的时候记得加上1)
      var ridy = datedy.getDate();  // 获取日(1-31)
      if(yuedy<9){
        yuedy = '0'+yuedy
      }
      if(ridy<9){
        ridy = '0'+ridy
      }
      this.timedata.mouth = niandy+'-'+yuedy+'-'+ridy
      this.getList()

    },
    methods: {
      getList(){
        this.loading = true;
        request({
          url: '/system/interface/stock',
          method: 'get',
          params:this.timedata
        }).then(response => {
          this.loading = false;
          this.tableData = []
          this.tableData.push(response.data)
        });
      },


    }
  };
</script>
<style lang="scss" >
  .materalsComsumption {
    .titlename{
      height: 80px;
      line-height: 80px;
      text-align: center;
      font-size: 30px;

    }
  }

</style>
